<!-- 
    Security Knowledge Framework is an expert system application 
    that uses OWASP Application Security Verification Standard, code examples,
    helps developers in pre-development and post-development.  
    Copyright (C) 2020  Glenn ten Cate, Riccardo ten Cate

    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU Affero General Public License as
    published by the Free Software Foundation, either version 3 of the
    License, or (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU Affero General Public License for more details.

    You should have received a copy of the GNU Affero General Public License
    along with this program. If not, see <http://www.gnu.org/licenses/>.
-->

<!-- **********************************************************************************************************************************************************
      MAIN CONTENT
      *********************************************************************************************************************************************************** -->
<!--main content start-->
<section id="main-content" class="page02 new-project">
  <section class="intro">
    <div class="inner">

      <div class="text">
        <h1>Create new user</h1>
        <p>Unique users leave a trail, so everyone can keep track of who did what.</p>
      </div>
    </div>
  </section>
  <section class="wrapper">
    <div class="row mt">
      <div class="col-lg-12">
        <div class="content-panel">

            <div *ngIf="isSubmitted && formControls.email.errors" class="help-block">
                <div *ngIf="formControls.email.errors.required">
                  <ngb-alert type="danger" [dismissible]="false">
                    email address is required!
                  </ngb-alert>
                </div>
                <div *ngIf="formControls.email.errors.email">
                    <ngb-alert type="danger" [dismissible]="false">
                      email address is invalid!
                    </ngb-alert>
                  </div>
              </div>
              
              
              <div *ngIf="isSubmitted && formControls.privilege_id.errors" class="help-block">
                  <div *ngIf="formControls.privilege_id.errors.required">
                    <ngb-alert type="danger" [dismissible]="false">
                      Select a privilege!
                    </ngb-alert>
                  </div>
                </div>

            <ngb-alert *ngIf="data" [dismissible]="false">
              <p><strong>Authorization token: </strong> for user with ID {{data.id}}  :  {{data.accessToken}}</p>
              <p>You must use the ID and token to activate users in the "first login" menu when authenticating.</p>
            </ngb-alert>
          <form [formGroup]="userForm" class="form-horizontal" style="padding-left:20px;padding-right:20px; padding-top:-20px;">
            <div class="form-group">
              <div class="wrap">
                <label for="inputmail" class="col-sm-2 control-label">E-Mail</label>
                <div class="col-sm-10">
                    <input formControlName="email" type="text" class="form-control" id="email" name="email" placeholder="example@owasp.org">
                    <div class="wrap desc alert-info">
                      <div class="col-sm-10">Please enter a valid E-Mail address</div>
                    </div>
                </div>
              </div>
            </div>
            
            <div class="form-group">
              <div class="wrap">
                <label for="inputmail" class="col-sm-2 control-label">Privileges</label>
                <div class="col-sm-10">
                  <select formControlName="privilege_id" class="form-control">
                    <option *ngFor="let item of privileges;" [ngValue]="item.id">{{item.privilege}}</option>
                  </select>
                  <div class="wrap desc alert-info">
                    <div class="col-sm-10">An <b>observer</b> can only view projects and reports, <b>Editors</b> can add and edit them.</div>
                  </div>
                </div>
              </div>
            </div>
            <!-- All for the next release :-)
            <div class="form-group">
              <div class="wrap">
                <label for="inputmail" class="col-sm-2 control-label">Avatar</label>
                <div class="col-sm-10">
                    <input required [(ngModel)]="file" type="file" class="form-control" id="inputFile" name="File" value="1.2" size="50" accept="jpg,jpeg,png">
                    <div class="wrap desc alert-info">
                      <div class="col-sm-10">Accepted formats: .jpg, .jpeg, .png</div>
                    </div>
                </div>
              </div>
            </div>
            -->
            <div class="buttons">
              <button type="submit" (click)="storeUser()" id="createUser" value="Create user" class="btn btn-default">Create user</button>
            </div>
          </form>
        </div>
      </div>
      <!-- /col-lg-4 -->
    </div>
    <!-- /row -->
  </section>
  <!--/wrapper -->
</section>
<!-- /MAIN CONTENT -->
